var rfidGetVue = new Vue({
    el:'#rfidGetVue',
    data:{
        comList:[] //串口list
        ,localIPList:[] //本机iplist
        ,comName:"-1"
        ,IPName:"-1"
        ,serverPort:6000 //服务默认的端口
        ,comConnect:false
        ,ipConnect:false
        ,clientName:""
        ,clientIndex:0
        ,clientListHeight:0
        ,clientList:[]
        ,clientListLen:0
        ,dataDivHeight:0
        ,socket:null
    },
    mounted:function () {
      var _this = this;
      _this.getCom();
      _this.getServerIp();
    },
    methods: {
        //获取本机com口
        getCom: function (event) {
            var _this = this;
            $.get("/rxtx/getCom", function(r){
                _this.comList = r.comList;
                console.log("串口接口返回数据：",r.comList)
            });
        },
        //获取服务端ip
        getServerIp: function () {
            var _this = this;
            $.get("/rxtx/getServerIp", function(r){
                _this.localIPList = r.localIPList;
                console.log("IP接口返回数据：",r.localIPList)
            });
            _this.clientListHeight = $("#leftDiv").height();
            _this.dataDivHeight = $("body").height() - _this.clientListHeight-50;
        },
        connectCom:function (type) {
            var _this = this;
            if(type){
                if(_this.comName == "-1"){
                    layer.msg("请选择串口")
                    return;
                }
                // var confirm = layer.confirm("确认使用"+_this.comName+"进行连接？",{btn:["确定","取消"],title:"连接"},function () {
                    var param = {
                        isOpen:type,
                        comName:_this.comName
                    }
                    $.post("/rxtx/comServerAction",param,function (data, textStatus, jqXHR) {
                        if(data.isAction){//串口连接成功
                            // layer.close(confirm)
                            layer.msg("串口连接成功")
                            _this.comConnect = true;
                            _this.getClientList();
                            return;
                        }else{
                            layer.msg("串口连接失败")
                            return;
                        }
                    })
                // })
            }else{
                var param = {
                    isOpen:type,
                    comName:_this.comName
                }
                $.post("/rxtx/comServerAction",param,function (data) {
                    console.log(data)
                    if(data.isAction){//串口连接成功
                        layer.msg("串口关闭成功")
                        _this.comConnect = false;
                        return;
                    }
                })
            }
        },
        connectIp:function (type) {
            var _this = this;
            if(type){
                if(_this.IPName == "-1"){
                    layer.msg("请选择IP")
                    return;
                }
                var param = {
                    isOpen:type,
                    serverIp:_this.IPName,
                    serverPort:_this.serverPort
                }
                $.post("/rxtx/ipServerAction",param,function (data) {
                    if(data.isAction){//串口连接成功
                        layer.msg("IP连接成功")
                        _this.getClientList();
                        _this.ipConnect = true;
                        return;
                    }else{
                        layer.msg("IP连接失败")
                        _this.ipConnect = false;
                        return;
                    }
                })
            }else{
                var param = {
                    isOpen:type,
                    serverIp:"1",
                    serverPort:"1"
                }
                $.post("/rxtx/ipServerAction",param,function (data) {
                    if(data.isAction){//串口连接成功
                        layer.msg("IP服务关闭成功")
                        _this.ipConnect = false;
                        return;
                    }
                })
            }
        },
        getClientList:function () {
            var _this = this;
            $.get("/rxtx/getClientInfo",function (msg) {
                _this.clientList = msg.clientList;
                _this.clientListLen = _this.clientList.length;
                console.log(_this.clientList)
            })
        },
        checkClient:function (event) {
            var _this = this;
            _this.clientName = event.target.getAttribute("ip");
            _this.clientIndex = event.target.getAttribute("id");
        },
        patrolStart:function () {
          //巡检开始
            var _this = this;
            _this.initWebsocket();//连接socket进行返回数据
            if(!_this.clientName){
                layer.msg("请选择可用设备")
                return;
            }
            $.get("/rxtx/readEPC",function (msg) {
                var isStart = msg.isStart;
                if(isStart){
                    layer.msg("巡检已经开启")
                    return;
                }else{
                    layer.msg("巡检开始失败，请重试")
                    return;
                }
            })
        },
        patrolStop:function () {
            //巡检关闭
            var _this = this;
            $.get("/rxtx/stopEPC",function (msg) {
                var isStop = msg.isStop;
                if(isStop){
                    _this.socket.close();//对应的socket关闭
                    layer.msg("巡检已经关闭")
                    return;
                }
            })
        }
        ,initWebsocket:function () {
            var _this = this;
            if(typeof(WebSocket) == "undefined") {
                console.log("您的浏览器不支持WebSocket");
            }else{
                console.log("您的浏览器支持WebSocket");

                //实现化WebSocket对象，指定要连接的服务器地址与端口  建立连接
                //等同于socket = new WebSocket("ws://localhost:8083/checkcentersys/websocket/20");
                // socket = new WebSocket("${basePath}websocket/${cid}".replace("http","ws"));
                // _this.socket = new WebSocket("/websocket/1".replace("http","ws"));
                if(_this.socket){//如果socket开启，则不进行再次开启
                    return;
                }
                _this.socket = new WebSocket("ws://localhost:9998/websocket/1");
                //打开事件
                _this.socket.onopen = function() {
                    console.log("Socket 已打开");
                    //socket.send("这是来自客户端的消息" + location.href + new Date());
                };
                //获得消息事件
                _this.socket.onmessage = function(msg) {
                    console.log(msg.data);
                    $("#contentDiv").append("<p>"+msg.data+"</p>")
                    //发现消息进入    开始处理前端触发逻辑
                };
                //关闭事件
                _this.socket.onclose = function() {
                    console.log("Socket已关闭");
                };
                //发生了错误事件
                _this.socket.onerror = function() {
                    alert("Socket发生了错误");
                    //此时可以尝试刷新页面
                }
            }
        }
    },
    destroyed:function () { //离开页面时，关闭socket
        console.log("离开页面时，关闭socket")
        alert("离开页面时，关闭socket")
        var _this = this;
        _this.connectIp(false);
        connectCom(false)
        if(_this.socket){
            layer.msg("bbbbbbbbbbbb")
            _this.socket.close();
        }
    }
});